<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title></title>
		<style type="text/css">
			#box{
				width: 300px;
				height: 300px;
				background: red;
			}
		</style>
		<script type="text/javascript">
			//将页面(包括图像、脚本文件、CSS 文件等)加载完以后再运行脚本
			window.onload = function(){
				var box  = document.getElementById("box");
//				box.onclick = function(){
//					alert('我是鼠标单击事件');
//				}

//				box.ondblclick = function(){
//					alert('我是鼠标双击事件');
//				}

//				box.onmousedown = function(){
//					alert('我是鼠标按下事件');
//				}

//				box.onmouseup = function(){
//					alert('我是鼠标抬起事件');
//				}

//				box.onmousemove = function(){
//					alert('我是鼠标移动事件');
//				}
				
//				box.onmouseover = function(){
//					alert('我是鼠标移入事件');
//				}

				box.onmouseout = function(){
					alert('我是鼠标移出事件');
				}
			}
		</script>
	</head>
	<body>
		<div id="box"></div>
	</body>
</html>
